<template>
  <div>
    <div class="life">
      <div class="life-text"><span>我的生活</span></div>
      <div class="life-view">
        <div class="life-view-item" @click="pushAttentionPage">
          <div>
            <svg t="1647864511368" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2219" width="32" height="32"><path d="M512 852.699L245.08 992.95c-32.28 16.962-70-10.451-63.832-46.392l50.972-297.025L16.296 439.174c-26.127-25.453-11.717-69.817 24.38-75.06l298.42-43.338L472.547 50.519c16.143-32.692 62.761-32.692 78.904 0l133.453 270.257 298.419 43.339c36.097 5.242 50.507 49.606 24.38 75.06L791.78 649.532l50.972 297.025c6.168 35.94-31.551 63.354-63.832 46.392L512 852.7z" p-id="2220" fill="#f4ea2a"></path></svg>
            <!-- <img src="@/assets/icon/follow.svg"> -->
          </div>
          <span>关注</span>
        </div>
        <div class="life-view-item" @click="$router.push('/financial')">
          <div>
            <svg t="1647864629145" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3438" width="32" height="32"><path d="M649.552239 508.179104H385.910448c-11.462687 0-19.104478-7.641791-19.104478-19.104477s7.641791-19.104478 19.104478-19.104478H649.552239c11.462687 0 19.104478 7.641791 19.104477 19.104478s-9.552239 19.104478-19.104477 19.104477zM649.552239 601.791045H385.910448c-11.462687 0-19.104478-7.641791-19.104478-19.104478s7.641791-19.104478 19.104478-19.104477H649.552239c11.462687 0 19.104478 7.641791 19.104477 19.104477s-9.552239 19.104478-19.104477 19.104478z" fill="#1296db" p-id="3439"></path><path d="M517.731343 722.149254c-11.462687 0-19.104478-7.641791-19.104477-19.104478V490.985075c0-11.462687 7.641791-19.104478 19.104477-19.104478s19.104478 7.641791 19.104478 19.104478v213.970149c0 9.552239-9.552239 17.19403-19.104478 17.19403z" fill="#1296db" p-id="3440"></path><path d="M519.641791 506.268657c-5.731343 0-11.462687-1.910448-15.283582-7.641791L401.19403 361.074627c-5.731343-7.641791-3.820896-21.014925 3.820895-26.746269 7.641791-5.731343 21.014925-3.820896 26.746269 3.820896l103.164179 135.641791c5.731343 7.641791 3.820896 21.014925-3.820895 26.746268-3.820896 3.820896-7.641791 5.731343-11.462687 5.731344z" fill="#1296db" p-id="3441"></path><path d="M513.910448 506.268657c-3.820896 0-7.641791-1.910448-11.462687-3.820896-7.641791-5.731343-9.552239-19.104478-3.820895-26.746268l103.164179-135.641792c5.731343-7.641791 19.104478-9.552239 26.746268-3.820895 7.641791 5.731343 9.552239 19.104478 3.820896 26.746269l-103.164179 135.641791c-3.820896 3.820896-9.552239 7.641791-15.283582 7.641791z" fill="#1296db" p-id="3442"></path><path d="M517.731343 985.791045c-252.179104 0-458.507463-206.328358-458.507462-458.507463s206.328358-458.507463 458.507462-458.507463c112.716418 0 219.701493 40.119403 303.761194 114.626866 19.104478 17.19403 36.298507 36.298507 53.492538 55.402985 13.373134 17.19403 11.462687 40.119403-5.731344 53.492537-17.19403 13.373134-40.119403 11.462687-53.492537-5.731343-13.373134-17.19403-28.656716-32.477612-43.940298-45.850746-70.686567-61.134328-160.477612-95.522388-254.089553-95.522388-210.149254 0-382.089552 171.940299-382.089552 382.089552s171.940299 382.089552 382.089552 382.089552 382.089552-171.940299 382.089553-382.089552c0-32.477612-3.820896-64.955224-11.462687-95.522388-5.731343-21.014925 7.641791-42.029851 26.746269-45.850746 21.014925-5.731343 42.029851 7.641791 45.850746 26.746268 9.552239 38.208955 15.283582 76.41791 15.283582 116.537314 0 250.268657-206.328358 456.597015-458.507463 456.597015z" fill="#1296db" p-id="3443"></path><path d="M852.059701 286.567164c-13.373134 0-26.746269-9.552239-28.656716-24.835821l-19.104478-118.447761c-1.910448-15.283582 7.641791-30.567164 22.925374-32.477612 15.283582-1.910448 30.567164 7.641791 32.477612 22.925373l19.104477 118.447761c1.910448 15.283582-7.641791 30.567164-22.925373 32.477612 0 1.910448-1.910448 1.910448-3.820896 1.910448z" fill="#1296db" p-id="3444"></path></svg>
            <!-- <img src="@/assets/icon/order.svg"> -->
          </div>
          <span>理财</span>
        </div>
        <div class="life-view-item" @click="$router.push('/message')">
          <div>
            <svg t="1647864686294" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4376" width="32" height="32"><path d="M747.776 889.344H270.592c-39.168 0-75.776-8.704-103.168-24.576-35.072-20.48-54.272-51.968-54.272-88.832v-2.56c0-46.08 33.792-100.608 76.8-128.768-14.336-51.2-14.336-117.76-14.336-168.192 0-150.784 68.864-266.24 194.048-326.912 14.848-58.88 71.936-101.632 139.52-101.632s124.672 42.752 139.52 101.632c123.392 60.16 194.048 181.248 194.048 334.592 0 50.176 0 111.104-14.08 160.512 17.152 11.008 33.792 26.368 47.616 44.288 22.272 28.416 34.56 58.88 34.56 85.76v2.56c0 77.056-84.48 112.128-163.072 112.128zM509.184 104.192c-44.288 0-82.176 29.696-86.528 67.84l-1.792 16.128-14.848 6.4c-113.92 49.664-174.08 147.2-174.08 281.6 0 51.2 0 128.512 18.176 170.752l11.776 26.88-27.392 10.496c-31.488 12.288-65.024 57.856-65.024 88.832v2.56c0 27.648 31.744 57.344 101.12 57.344h477.184c43.008 0 106.752-14.848 106.752-56.064v-2.56c0-29.952-37.12-77.056-70.656-90.112l-27.392-10.496 11.776-26.88c18.176-42.24 18.176-112.128 18.176-163.072 0-69.12-15.872-129.792-46.848-180.224-29.952-48.64-72.704-85.248-127.232-109.056l-14.848-6.4-1.792-16.128c-4.352-38.144-42.24-67.84-86.528-67.84z" p-id="4377" fill="#dcb92a"></path><path d="M512 976.128c-87.552 0-155.904-49.92-155.904-113.664v-2.048l0.512-27.392h310.784l0.512 27.392v2.048c0 63.744-68.352 113.664-155.904 113.664z m-87.04-86.784c17.408 17.664 50.688 30.464 87.04 30.464s69.888-12.544 87.04-30.464h-174.08z" p-id="4378" fill="#dcb92a"></path></svg>
            <!-- <img src="@/assets/icon/message.svg"> -->
          </div>
          <span>消息</span>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name:"myLife",
  data(){
    return {

    }
  },
  methods:{
    // 路由切换
    pushAttentionPage(){
      this.$router.push('/profile/attention')
    }
  }
}
</script>

<style lang="less">
  .life {
    margin: 0 auto;
    margin-top: 15px;
    width: 355px;
    height: 110px;
    // line-height: 20px;
    border-radius: 15px;
    // text-align: center;
    box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(187, 187, 187, 100);
    .life-text {
      margin-left: 14px;
      margin-top: 9px;
      color: rgba(16, 16, 16, 100);
      font-size: 20px;
      text-align: left;
      font-family: PingFangSC-semiBold;
    }
    .life-view {
      display: flex;
      justify-content:space-around ;
      margin-top: 10px;
      .life-view-item {
        text-align: center;
        // height: 100%;
        // width: 50px;
        // border: 1px solid red;
      }
    }
  }
</style>